<template>
	<view>
		<view class="c-pop-box ce transformZ">
			<view class="pop-wrapper dis-flex" :class="{ gap: gap }">
				<view class="bg-back-w">
					<view class="dis-flex"><slot></slot></view>
					<view v-if="advert" style="margin-top:60upx;margin-bottom:30upx"><banner-ad></banner-ad></view>
				</view>
				<view v-if="close" @click="popShow()" class="pop-close"><image class="bg-back" mode="widthFix" src="/static/images/ui_buanbi.png"></image></view>
			</view>
		</view>
	</view>
</template>
<script>
import { mapGetters, mapActions } from 'vuex';
export default {
	name: 'c-pop-box',
	props: {
		d: {
			type: Object,
			default: {
				gap: true,
				close: true,
				advert: true
			}
		}
	},
	components: {},
	data() {
		return {
			list: []
		};
	},
	watch: {},
	computed: {
		gap:function(){
			return this.d.gap
		},
		close:function(){
			return this.d.close
		},
		advert:function(){
			return this.d.advert
		},
	},
	methods: {
		...mapActions('pop', ['popShow'])
	},
	created() {},
	mounted() {}
};
</script>
<style lang="scss" scoped>
.c-pop-box {
	position: fixed;
	z-index: 100;
	overflow: auto;
	backdrop-filter: blur(10px);
	background-color: rgba(7, 17, 27, 0.8);
	.pop-wrapper {
		position: relative;
		min-height: 100%;
		&.gap {
			padding-top: 65upx;
			padding-bottom: 240upx;
		}

		.pop-close {
			position: absolute;
			left: 50%;
			margin-left: -30upx;
			bottom: 150upx;
			width: 60upx;
			height: 60upx;
			z-index: 1000;
		}
	}
}
</style>
